<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>航班数据可视化查询</title>
	<link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
	<link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="https://openlayers.org/en/v4.6.5/css/ol.css" type="text/css">
    <link rel="stylesheet" href="css/flights.css">
</head>
<body>
	
	<div id="wrapper">
        <div class="overlay"></div>
        <!-- Sidebar -->
        <nav class="navbar navbar-inverse navbar-fixed-top" id="sidebar-wrapper" role="navigation">
            <ul class="nav sidebar-nav">
                <li class="sidebar-brand">
                    <a href="#">
                       航线及地图操作
                    </a>
                </li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-fw fa-globe"></i>选择地图<span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li style="padding:10px 15px 10px 30px;color:#DDD">
                            <a href="#" class="load_map_normal">加载常规地图</a>
                        </li>
                        <li style="padding:10px 15px 10px 30px;color:#DDD">
                            <a href="#" class="load_map_image">加载卫星地图</a>
                        </li>
                    </ul>
                </li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-fw fa-eye"></i> 按航班号查询<span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li style="padding:10px 15px 10px 30px;color:#DDD">
                            <form class="form-inline">
                                <input type="text" id="flightno" placeholder="请输入航班号" style="width:120px" class="form-control input-sm" />
                                <button type="button" id="btn_filter_flight" class="btn btn-default btn-sm">查询</button>
                            </form>
                        </li>
                    </ul>
                </li>
                <li>
                    <a href="#" class="filter_airport" ><i class="fa fa-fw fa-bolt"></i>按区域查询</a>
                </li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-fw fa-binoculars"></i> 按分类查询<span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="#" class="load_local">国内航线</a></li>
                        <li><a href="#" class="load_global">国际航线</a></li>
                        <li><a href="#" class="load_full">全球航线</a></li>
                    </ul>
                </li>
            </ul>
        </nav>
        <!-- /#sidebar-wrapper -->

        <!-- Page Content -->
        <div id="page-content-wrapper" style="height: 100%">
          <button type="button" class="hamburger is-closed animated fadeInLeft" data-toggle="offcanvas">
            <span class="hamb-top"></span>
            <span class="hamb-middle"></span>
            <span class="hamb-bottom"></span>
          </button>
            <div class="container-fluid" style="height: 100%;padding:0px">
                <div id="map" class="map"></div>
            </div>
        </div>
        <!-- /#page-content-wrapper -->

        <!-- #popup-panel -->
        <div id="popup" class="ol-popup" style="display: none">
            <a href="#" id="popup-closer" class="ol-popup-closer"></a>
            <div id="popup-content"></div>
        </div>
        <!-- /#popup-panel -->

        <!-- #airport-filter-box -->
        <div id="cityFilterBox" class="cityFilterBox FilterBox" style="display: none;">
            <div class="cityFilterWrap">
                <div class="cityFilterInput" style="display:block;">
                        <div>
                            <input type="text" name="from" placeholder="请选择出发地" class="form-control input-sm" name="fromAirport" id="from_airport" />
                            <input type="text" name="to" placeholder="请选择目的地" class="form-control input-sm" name="toAirport" id="to_airport" />
                        </div>
                        <div style="margin-top:2px">
                            <input type="text" name="from" placeholder="请选择开始时间" class="form-control input-sm" name="fromAirport" id="begin_date" />
                            <input type="text" name="to" placeholder="请选择结束时间" class="form-control input-sm" name="toAirport" id="end_date" />
                            <button class="btn btn-default btn-sm" id="btn-search-demo">查询</button>
                        </div>

                </div>
                <div class="cityFilterIn" style="display: none;">
                    <div class="cityFilterHead FilterHead">
                        <ul class="clearfix">
                            <li class="cur">热门</li>
                            <li class="">ABCD</li>
                            <li class="">EFGH</li>
                            <li class="">JKLM</li>
                            <li>NOPQRS</li>
                            <li class="">TUVWX</li>
                            <li>YZ</li>
                            <li id="hotOutTog" class="">国际/地区/两岸</li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                    <div class="cityFilterTable FilterTable" id="cityFilterTable">
                        <div class="cityFilterHot" style="display: block;">
                            <ul><li style="padding-left:0"><div class="cityFilterLabel"></div><div class="cityByHot clearfix"><span code="PEK">北京首都</span><span code="CAN">广州白云</span><span code="PVG">上海浦东</span><span code="SHA">上海虹桥</span><span code="CTU">成都双流</span><span code="SZX">深圳宝安</span><span code="KMG">昆明长水</span><span code="XIY">西安咸阳</span><span code="CKG">重庆江北</span><span code="HGH">杭州萧山</span><span code="XMN">厦门高崎</span><span code="NKG">南京禄口</span><span code="WUH">武汉天河</span><span code="SHE">沈阳桃仙</span><span code="TAO">青岛流亭</span><span code="FOC">福州长乐</span><span code="SYX">三亚凤凰</span><span code="TSN">天津滨海</span></div></li></ul>
                        </div>
                        <div class="cityFilterByAD" style="display: none;">
                            <ul><li><div class="cityFilterLabel">A</div><div class="cityByA clearfix"><span code="AHJ">阿坝红原</span><span code="YIE">阿尔山伊尔施</span><span code="AKU">阿克苏温宿</span><span code="AAT">阿勒泰</span><span code="NGQ">阿里昆莎</span><span code="AKA">安康</span><span code="AQG">安庆天柱山</span><span code="AOG">鞍山腾鳌</span><span code="AVA">安顺黄果树</span><span code="AYN">安阳北郊</span><span code="MFM">澳门</span></div></li><li><div class="cityFilterLabel">B</div><div class="cityByB clearfix"><span code="AEB">百色田阳</span><span code="BSD">保山云瑞</span><span code="BAV">包头二里半</span><span code="RLK">巴彦淖尔天吉泰</span><span code="MFK">北竿</span><span code="BHY">北海福成</span><span code="NAY">北京南苑</span><span code="PEK">北京首都</span><span code="BFJ">毕节飞雄</span><span code="BPL">博乐阿拉山口</span></div></li><li><div class="cityFilterLabel">C</div><div class="cityByC clearfix"><span code="CGQ">长春龙嘉</span><span code="CGD">常德桃花源</span><span code="BPX">昌都邦达</span><span code="CSX">长沙黄花</span><span code="CIH">长治王村</span><span code="CZX">常州奔牛</span><span code="CHG">朝阳</span><span code="CTU">成都双流</span><span code="CIF">赤峰玉龙</span><span code="JUH">池州九华山</span><span code="CKG">重庆江北</span></div></li><li><div class="cityFilterLabel">D</div><div class="cityByD clearfix"><span code="DLU">大理荒草坝</span><span code="DDG">丹东浪头</span><span code="DCY">稻城亚丁</span><span code="DQA">大庆萨尔图</span><span code="DAT">大同云冈</span><span code="DAX">达州河市</span><span code="HXD">德令哈</span><span code="DIG">迪庆香格里拉</span><span code="DOY">东营胜利</span><span code="DNH">敦煌</span><span code="DLC">大连周水子</span></div></li></ul>
                        </div>
                        <div class="cityFilterByEH" style="display: none;">
                            <ul><li><div class="cityFilterLabel">E</div><div class="cityByE clearfix"><span code="EJN">额济纳旗桃来</span><span code="ENH">恩施许家坪</span><span code="ERL">二连浩特赛乌素</span></div></li><li><div class="cityFilterLabel">F</div><div class="cityByF clearfix"><span code="LCX">福建龙岩冠豸山</span><span code="FUG">阜阳西关</span><span code="FYJ">抚远东极</span><span code="FYN">富蕴</span><span code="FOC">福州长乐</span></div></li><li><div class="cityFilterLabel">G</div><div class="cityByG clearfix"><span code="KOW">赣州黄金</span><span code="KHH">高雄</span><span code="GOQ">格尔木</span><span code="GYS">广元盘龙</span><span code="CAN">广州白云</span><span code="KWL">桂林两江</span><span code="KWE">贵阳龙洞堡</span><span code="GYU">固原六盘山</span></div></li><li><div class="cityFilterLabel">H</div><div class="cityByH clearfix"><span code="HRB">哈尔滨太平</span><span code="HAK">海口美兰</span><span code="HLD">海拉尔东山</span><span code="HMI">哈密</span><span code="HDG">邯郸</span><span code="HGH">杭州萧山</span><span code="HZG">汉中城固</span><span code="HCJ">河池金城江</span><span code="HFE">合肥新桥</span><span code="HEK">黑河</span><span code="HCN">恒春五里亭</span><span code="HNY">衡阳南岳</span><span code="HTN">和田</span><span code="HIA">淮安涟水</span><span code="HJJ">怀化芷江</span><span code="HUN">花莲</span><span code="TXN">黄山屯溪</span><span code="HTT">花土沟</span><span code="HET">呼和浩特白塔</span><span code="HUZ">惠州平潭</span></div></li></ul>
                        </div>
                        <div class="cityFilterByJM" style="display: none;">
                            <ul><li><div class="cityFilterLabel">J</div><div class="cityByJ clearfix"><span code="JMU">佳木斯</span><span code="CYI">嘉义</span><span code="JGN">嘉峪关</span><span code="SWA">揭阳潮汕</span><span code="JIL">吉林二台子</span><span code="TNA">济南遥墙</span><span code="JIC">金昌金川</span><span code="JDZ">景德镇罗家</span><span code="JGS">井冈山</span><span code="JNG">济宁曲阜</span><span code="JNZ">锦州湾</span><span code="JIU">九江庐山</span><span code="JZH">九寨沟黄龙</span><span code="JXA">鸡西兴凯湖</span></div></li><li><div class="cityFilterLabel">K</div><div class="cityByK clearfix"><span code="KJI">喀纳斯布尔津</span><span code="KGT">康定</span><span code="KHG">喀什</span><span code="KRY">克拉玛依</span><span code="KCA">库车龟兹</span><span code="KRL">库尔勒</span><span code="KMG">昆明长水</span></div></li><li><div class="cityFilterLabel">L</div><div class="cityByL clearfix"><span code="LXA">拉萨贡嘎</span><span code="LYG">连云港白塔埠</span><span code="LLB">荔波</span><span code="LJG">丽江三义</span><span code="LNJ">临沧博尚</span><span code="LFQ">临汾乔李</span><span code="LXI">林西</span><span code="LYI">临沂沭埠岭</span><span code="LZY">林芝米林</span><span code="HZH">黎平</span><span code="LPF">六盘水月照</span><span code="LZH">柳州白莲</span><span code="LYA">洛阳北郊</span><span code="LZO">泸州蓝田</span><span code="LLV">吕梁大武</span></div></li><li><div class="cityFilterLabel">M</div><div class="cityByM clearfix"><span code="LUM">芒市</span><span code="NZH">满洲里西郊</span><span code="MXZ">梅县长岗岌</span><span code="MIG">绵阳南郊</span><span code="OHE">漠河古莲</span><span code="MDG">牡丹江海浪</span></div></li></ul>
                        </div>
                        <div class="cityFilterByNS" style="display: none;">
                            <ul><li><div class="cityFilterLabel">N</div><div class="cityByN clearfix"><span code="KHN">南昌昌北</span><span code="NAO">南充高坪</span><span code="LZN">南竿</span><span code="NKG">南京禄口</span><span code="NNG">南宁吴圩</span><span code="YXG">南沙永暑礁</span><span code="NTG">南通兴东</span><span code="NNY">南阳姜营</span><span code="NGB">宁波栎社</span><span code="NLH">宁蒗泸沽湖</span></div></li><li><div class="cityFilterLabel">P</div><div class="cityByP clearfix"><span code="PIF">屏东</span><span code="SYM">普洱思茅</span></div></li><li><div class="cityFilterLabel">Q</div><div class="cityByQ clearfix"><span code="IQM">且末</span><span code="CMJ">七美</span><span code="TAO">青岛流亭</span><span code="IQN">庆阳西峰</span><span code="SHP">秦皇岛山海关</span><span code="NDG">齐齐哈尔三家子</span><span code="JJN">泉州晋江</span><span code="JUZ">衢州</span></div></li><li><div class="cityFilterLabel">R</div><div class="cityByR clearfix"><span code="RIZ">日照山字河</span></div></li><li><div class="cityFilterLabel">S</div><div class="cityByS clearfix"><span code="SYX">三亚凤凰</span><span code="SHA">上海虹桥</span><span code="PVG">上海浦东</span><span code="SQD">上饶三清山</span><span code="KNH">尚义</span><span code="HSC">韶关</span><span code="HPG">神农架红坪</span><span code="SHE">沈阳桃仙</span><span code="SZX">深圳宝安</span><span code="SHF">石河子花园</span><span code="SJW">石家庄正定</span><span code="WDS">十堰武当山</span></div></li></ul>
                        </div>
                        <div class="cityFilterByTX" style="display: none;">
                            <ul><li><div class="cityFilterLabel">T</div><div class="cityByT clearfix"><span code="TSA">台北松山</span><span code="TPE">台北桃园</span><span code="TTT">台东丰年</span><span code="TNN">台南</span><span code="TYN">太原武宿</span><span code="TXG">台中</span><span code="RMQ">台中清泉岗</span><span code="HYN">台州路桥</span><span code="TVS">唐山三女河</span><span code="TCZ">腾冲驼峰</span><span code="TSN">天津滨海</span><span code="THQ">天水麦积山</span><span code="TNH">通化</span><span code="TGO">通辽</span><span code="TEN">铜仁凤凰</span><span code="TLQ">吐鲁番交河</span></div></li><li><div class="cityFilterLabel">W</div><div class="cityByW clearfix"><span code="WEF">潍坊</span><span code="WEH">威海大水泊</span><span code="WNH">文山普者黑</span><span code="WNZ">温州龙湾</span><span code="WUA">乌海</span><span code="WUH">武汉天河</span><span code="UCB">乌兰察布集宁</span><span code="HLH">乌兰浩特依勒力特</span><span code="URC">乌鲁木齐地窝堡</span><span code="WUX">无锡硕放</span><span code="WUS">武夷山</span><span code="WUZ">梧州长洲岛</span></div></li><li><div class="cityFilterLabel">X</div><div class="cityByX clearfix"><span code="XMN">厦门高崎</span><span code="HKG">香港赤鱲角</span><span code="XFN">襄阳刘集</span><span code="XIY">西安咸阳</span><span code="XIC">西昌青山</span><span code="XIL">锡林浩特</span><span code="XNT">邢台褡裢</span><span code="ACX">兴义万峰林</span><span code="XNN">西宁曹家堡</span><span code="WUT">忻州五台山</span><span code="JHG">西双版纳嘎洒</span><span code="XUZ">徐州观音</span></div></li></ul>
                        </div>
                        <div class="cityFilterByYZ" style="display: none;">
                            <ul><li><div class="cityFilterLabel">Y</div><div class="cityByY clearfix"><span code="YNZ">盐城南洋</span><span code="YTY">扬州泰州</span><span code="YNJ">延吉朝阳川</span><span code="YNT">烟台蓬莱</span><span code="YBP">宜宾菜坝</span><span code="YIH">宜昌三峡</span><span code="LDS">伊春林都</span><span code="YIC">宜春明月山</span><span code="INC">银川河东</span><span code="YKH">营口兰旗</span><span code="YIN">伊宁</span><span code="YIW">义乌</span><span code="LLF">永州零陵</span><span code="RHT">右旗巴丹吉林</span><span code="UYN">榆林榆阳</span><span code="YCU">运城关公</span><span code="YUS">玉树巴塘</span></div></li><li><div class="cityFilterLabel">Z</div><div class="cityByZ clearfix"><span code="ZQZ">张家口宁远</span><span code="YZY">张掖甘州</span><span code="ZHA">湛江</span><span code="ZAT">昭通</span><span code="CGO">郑州新郑</span><span code="ZHY">中卫沙坡头</span><span code="HSN">舟山普陀山</span><span code="ZUH">珠海金湾</span><span code="ZYI">遵义新舟</span><span code="AXF">左旗巴彦浩特</span></div></li></ul>
                        </div>
                    </div>
                </div>
                <div class="cityFilterOut" style="display: none;">
                    <div class="cityFilterHead FilterHead">
                        <ul class="clearfix">
                            <li class="">国际/地区/两岸</li>
                            <li class="">亚洲</li>
                            <li class="">欧洲</li>
                            <li class="">美洲</li>
                            <li class="">非洲</li>
                            <li class="">大洋洲</li>
                            <li id="hotInTog" class="cur">国内热门</li>
                        </ul>
                        <div class="clear"></div>
                    </div>
                    <div class="cityFilterTable FilterTable" id="cityFilterTable2">
                        <div class="cityFilterByOuthot clearfix" style="display: block;"><span code="HKG">香港赤鱲角</span><span code="GMP">首尔金浦</span><span code="ICN">首尔仁川</span><span code="TSA">台北松山</span><span code="TPE">台北桃园</span><span code="NRT">东京成田</span><span code="HND">东京羽田</span><span code="SIN">新加坡樟宜</span><span code="MFM">澳门</span><span code="BKK">曼谷(素万那普)</span><span code="KIX">大阪关西</span><span code="ITM">大阪伊丹</span><span code="SGN">胡志明市新山一</span><span code="MNL">马尼拉</span><span code="NGO">名古屋中部/新特丽亚</span><span code="LGW">伦敦盖特威克</span><span code="LHR">伦敦希思罗</span><span code="KUL">吉隆坡</span><span code="PUS">釜山金海</span><span code="SYD">悉尼金斯福德·史密斯</span><span code="FRA">法兰克福</span><span code="YVR">温哥华</span><span code="ORY">巴黎－奥利</span><span code="CDG">巴黎戴高乐</span><span code="JFK">纽约肯尼迪</span><span code="LGA">纽约拉瓜迪亚</span><span code="LAX">洛杉矶</span><span code="VKO">莫斯科伏努科沃</span><span code="SVO">莫斯科谢诺梅杰沃</span><span code="DME">莫斯科多莫杰多沃</span></div>
                        <div class="cityFilterByAsia clearfix" style="display: none;"><span code="HKG">香港赤鱲角</span><span code="NRT">东京成田</span><span code="HND">东京羽田</span><span code="TPE,TSA">台北</span><span code="TSA">台北松山</span><span code="TPE">台北桃园</span><span code="GMP">首尔金浦</span><span code="ICN">首尔仁川</span><span code="SIN">新加坡樟宜</span><span code="BKK">曼谷(素万那普)</span><span code="KUL">吉隆坡</span><span code="KIX">大阪关西</span><span code="ITM">大阪伊丹</span><span code="MFM">澳门</span><span code="CGK">雅加达苏加诺-哈达</span><span code="SGN">胡志明市新山一</span><span code="MNL">马尼拉</span><span code="DPS">登巴萨巴厘岛</span><span code="NGO">名古屋中部/新特丽亚</span><span code="HKT">普吉岛普吉</span><span code="HAN">河内内拜</span><span code="MLE">马累</span><span code="DXB">迪拜</span><span code="PUS">釜山金海</span><span code="KTM">加德满都</span><span code="KHH">高雄</span><span code="FUK">福冈</span><span code="PNH">金边</span><span code="DEL">新德里德里</span><span code="CJU">济州岛济州</span><span code="IST">伊斯坦布尔阿塔图尔克</span><span code="ULN">乌兰巴托</span><span code="BOM">孟买</span></div>
                        <div class="cityFilterByEurope clearfix" style="display: none;"><span code="LGW">伦敦盖特威克</span><span code="LHR">伦敦希思罗</span><span code="ORY">巴黎－奥利</span><span code="CDG">巴黎戴高乐</span><span code="FRA">法兰克福</span><span code="VKO">莫斯科伏努科沃</span><span code="SVO">莫斯科谢诺梅杰沃</span><span code="DME">莫斯科多莫杰多沃</span><span code="FCO">罗马菲乌米奇诺</span><span code="AMS">荷兰阿姆斯特丹斯史基浦(西霍普)</span><span code="LIN">米兰利纳特</span><span code="MXP">米兰马尔本萨</span><span code="MUC">慕尼黑</span><span code="ARN">斯德哥尔摩</span><span code="SXF">柏林舍讷费尔德</span><span code="TXL">柏林泰格尔</span><span code="MAN">曼彻斯特</span><span code="MAD">马德里</span><span code="ZRH">苏黎世</span><span code="BRU">布鲁塞尔</span><span code="CPH">哥本哈根</span><span code="HEL">赫尔辛基</span><span code="BCN">巴塞罗那</span><span code="ATH">雅典</span><span code="EDI">爱丁堡</span><span code="BHX">伯明翰</span><span code="NTL">纽卡斯尔威廉斯敦</span><span code="GVA">日内瓦</span><span code="LED">圣彼得堡</span><span code="IEV">基辅</span><span code="BUD">布达佩斯</span><span code="HAM">汉堡</span><span code="PRG">布拉格</span></div>
                        <div class="cityFilterByAmerica clearfix" style="display: none;"><span code="JFK">纽约肯尼迪</span><span code="LGA">纽约拉瓜迪亚</span><span code="LAX">洛杉矶</span><span code="SFO">旧金山</span><span code="YVR">温哥华</span><span code="ORD">芝加哥奥黑尔</span><span code="YYZ">多伦多皮尔逊</span><span code="SEA">西雅图塔科马</span><span code="IAD">华盛顿杜勒斯</span><span code="BOS">波士顿</span><span code="DTW">底特律大都会</span><span code="IAH">休斯敦</span><span code="YUL">蒙特利尔特鲁多</span><span code="AHL">Aishalton夏威夷</span><span code="SPN">塞班</span><span code="GRU">圣保罗</span><span code="YOW">渥太华</span><span code="MEX">墨西哥城</span><span code="LAS">拉斯维加斯麦卡伦</span><span code="YYC">卡尔加里CALGARY</span><span code="EZE">布宜诺斯艾利斯埃塞萨皮斯塔里尼部长</span></div>
                        <div class="cityFilterByAfrica clearfix" style="display: none;"><span code="CAI">开罗</span><span code="JNB">约翰内斯堡</span><span code="CPT">开普敦开普顿</span><span code="NBO">内罗毕乔莫·肯雅塔</span><span code="LAD">罗安达二月四日</span><span code="MRU">毛里求斯</span><span code="DAR">达累斯萨拉姆尼雷尔</span><span code="ADD">亚的斯亚贝巴博乐</span><span code="ACC">阿克拉科托卡</span><span code="DUR">德班</span><span code="HRE">哈拉雷</span></div>
                        <div class="cityFilterByOceania clearfix" style="display: none;"><span code="SYD">悉尼金斯福德·史密斯</span><span code="MEL">墨尔本</span><span code="AKL">奥克兰</span><span code="BNE">布里斯班</span><span code="ADL">阿德莱德</span><span code="PER">珀斯</span><span code="WLG">惠灵顿</span><span code="CBR">堪培拉</span></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- /#airport-filter-box-->
    </div>
    <!-- /#wrapper -->

    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
    <script src="https://openlayers.org/en/v4.6.5/build/ol.js"></script>
    <script src="js/arc.js"></script>
    <!--<script src="https://api.mapbox.com/mapbox.js/plugins/arc.js/v0.1.0/arc.js"></script>-->
    <script src="js/airportGPS0.js"></script>

    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<script src="js/flights.js" charset="utf-8"></script>
</body>
</html>